
<!--
	作者：lsd
	时间：2020-4-15
	描述：物料组管理
-->
<template>
	<div class="m-view-materials m-window">
    	<!-- 搜索头 -->
		<div class="m-condition">
			<el-row :gutter="5">
				<el-form
					:model="formSearch"
					ref="formSearch"
					label-width="70px"
					:inline-message="true"
					label-position="left"
				>
					<el-col :span="6">
						<el-form-item label="编码" class="rightItem">
							<el-input
								value-key="id"
								v-model.trim="formSearch.matgroupNo"
								placeholder="请输入编码"
								clearable
								maxlength="20"
							></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item label="名称" class="rightItem">
							<el-input
								value-key="id"
								v-model.trim="formSearch.matgroupName"
								placeholder="请输入名称"
								clearable
								maxlength="20"
							></el-input>
						</el-form-item>
					</el-col>
				</el-form>

				<el-col :span="2" :offset="8">
					<el-button type="primary" @click="search(true)">查询</el-button>
				</el-col>
				<el-col :span="2">
					<el-button type="primary" @click="synchronization">同步</el-button>
				</el-col>
			
			</el-row>
		</div>

    <!-- 表单 -->
		<div class="m-agTable m-bottom" v-loading="loading">
			<agGridComponents
				ref="agGridComponent"
				:getGridOptions="gridOptions"
				:getColumnDefs="columnDefs"
				:getRowSelection="'multiple'"
				:isColFit="true"
			></agGridComponents>
		</div>

    <!-- 页脚 -->
		<div class="m-page">
			<el-pagination
				@size-change="handleSizeChange"
				@current-change="handleCurrentChange"
				:current-page="pageInfo.currentPage"
				:page-sizes="[30,50,100,150,200 ]"
				:page-size="pageInfo.pageSize"
				layout="total, sizes, prev, pager, next, jumper"
				:total="total"
			></el-pagination>
		</div>

  </div>
</template>
  
<script>
import agGridComponents from "@/components/agGridComponents.js";
import _Api from "@/api";
import localeText from "@/i18n/agGridText";

/**
 * materials
 * 物料组管理
 */
export default {
	name: 'materials',
	components:{
		agGridComponents,
	},
	data(){
		return {
			formSearch:{//查询表
				matgroupName: '',
				matgroupNo: '',
			},
			optionsCompanyName: [],
			rowData: [], // 表格数据
			//表格参数
			gridOptions: '',
			columnDefs: [],
			//页脚参数
			pageInfo: {
				pageSize: 30,
				currentPage: 1,
			},
			total: 0,

			//加载参数
			loading: false,//页面的
		}
	},
	beforeMount () {
		this.gridOptions = {
			context: {
				componentParent: this
			},
			enableColResize: true,
			localeText: localeText,
			suppressRowClickSelection: true,//单元格选中,false为选中整行
		};
		this.columnDefs = [
			{	headerName: "编码", field: "matgroupNo", width: 200,
				checkboxSelection: true,
				headerCheckboxSelection: true			},
			{ headerName: "名称", field: "matgroupName", width: 200 },
			{ headerName: "创建人", field: "creator", width: 100 },
			{ headerName: "创建时间", field: "createDate", width: 100 },
			{ headerName: "修改人", field: "modifyer", width: 100 },
			{ headerName: "修改时间", field: "modifyDate", width: 100 },
		];

	},
	mounted(){
		this.search();
	},
	methods:{
		/**
		 * @vuese
		 * 查询方法
		 * 
		 * @arg 参数是布尔值， true就是点击触发，false就是非点击触发
		 */
		search(isClick){
			this.pageInfo.currentPage = isClick ? 1 : this.pageInfo.currentPage;
			this.loading = true;
			let param = {
				...this.formSearch,
				...this.pageInfo
			};
			_Api
				.searchMaterials(param)
				.then(res => {
					this.loading = false;
					if (res.data.code == 1) {
						this.rowData = res.data.rows;
						this.total = res.data.total
						this.$refs.agGridComponent.gridOptions.api.setRowData(this.rowData);
					} else {
						this.$alert(res.data.info, { showClose: false, confirmButton: "确定", customClass: "alertFailure" });
					}
				})
				.catch(err => {
					this.loading = false;
					this.$alert(err.data.info, { showClose: false, confirmButton: "确定", customClass: "alertFailure" });
				});
		},
		
		/**
		 * @vuese
		 * 同步方法
		 */
		synchronization(){
			this.loading = true;
			let param = {
				creator: this.$global.user.employeeName,
				creatorId: this.$global.user.id,
			}
			_Api
				.synchronizationData(param)
				.then(res => {
					this.loading = false;
					if (res.data.code == 1) {
						this.rowData = res.data.rows;
						this.total = res.data.total
						this.$refs.agGridComponent.gridOptions.api.setRowData(this.rowData);
						this.search();
					} else {
						this.$alert(res.data.info, { showClose: false, confirmButton: "确定", customClass: "alertFailure" });
					}
				})
				.catch(err => {
					this.loading = false;
					this.$alert(err.data.info, { showClose: false, confirmButton: "确定", customClass: "alertFailure" });
				});
		},

		
		/**
		 * @vuese
		 * 改变页脚总条数方法
		 * 
		 * @arg 参数是 int 值，代表一页有多少条数据
		 */
		handleSizeChange (val) {
			this.pageInfo.pageSize = val;
			this.pageInfo.currentPage = 1;
			this.search();
		},

		/**
		 * @vuese
		 * 翻页方法
		 * 
		 * @arg 参数是 int 值，代表页数
		 */
		handleCurrentChange (val) {
			this.pageInfo.currentPage = val;
			this.search();
		},
		

	}
}
</script>
  
